// 获取所有评论数据渲染展示
// 接口地址： http://www.liulongbin.top:3006/api/cmtlist
// 请求方式： GET

// 发表评论
// 接口地址： http://www.liulongbin.top:3006/api/addcmt
// 请求方式： POST

$(function(){
    // 获取列表数据，渲染
   function render(){
    $.ajax({
        method:'GET',
        url:'http://www.liulongbin.top:3006/api/cmtlist',
        success({status,msg,data}){
            if(status !== 200) return alert(msg)
            const newStr = data.map( ({content,time,username})=> `
                <li class="list-group-item">
                    <span class="badge" style="background-color: #F0AD4E;">评论时间：${time}</span>
                    <span class="badge" style="background-color: #5BC0DE;">评论人：${username}</span>
                    ${content}
                </li>
                `
            ).join('')
            $('#cmt-list').html(newStr)
        }
    })
   }
   render()

//    评论
   $('#formAddCmt').on('submit',function(e){
        e.preventDefault()
        const data = $(this).serialize()
        
        $.ajax({
            method:'POST',
            url:'http://www.liulongbin.top:3006/api/addcmt',
            data,
            success({status,msg}){
                if(status !== 201) return alert(msg)
                render()
                // 重置列表
                // 表单是DOM对象.reset()
                // $(#formAddCmt').reset()  jq对象无法使用reset方法，需要将jQ对象转为DOM对象
                $('#formAddCmt')[0].reset()
            }
        })
   })

})


